<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>优田儿童成长中心</title>
    <link href="/static/assets/fontAwesome/css/fontawesome-all.min.css" rel="stylesheet">
    <link href="/static/assets/css/lib/themify-icons.css" rel="stylesheet">
    <link href="/static/assets/css/lib/mmc-chat.css" rel="stylesheet"/>
    <link href="/static/assets/css/lib/sidebar.css" rel="stylesheet">
    <link href="/static/assets/css/lib/bootstrap.min.css" rel="stylesheet">
    <link href="/static/assets/css/lib/nixon.css" rel="stylesheet">
    <link href="/static/assets/lib/lobipanel/css/lobipanel.min.css" rel="stylesheet">
    <link href="/static/assets/css/style.css" rel="stylesheet">
    <script src="/static/js/jquery-1.11.0.js"></script>
</head>

<body>
<div class="sidebar sidebar-hide-to-small sidebar-shrink sidebar-gestures">
    <div class="nano">
        <div class="nano-content">
            <ul>
                <li>
                    <a href="/home/"><i class="ti-bar-chart"></i> 统计数据</a>
                </li>
                <li>
                    <a href="/teacher/"><i class="ti-user"></i> 教师管理</a>
                </li>
                <li class="active">
                    <a href="/child/"><i class="ti-user"></i> 幼儿管理<span
                            class="sidebar-collapse-icon ti-angle-right"></span></a>
                </li>
                <li>
                    <a href="/posts/"><i class="ti-desktop"></i> 岗位管理</a>
                </li>
            </ul>
        </div>
    </div>
</div>
<div class="header">
    <div class="pull-left">
        <div class="logo">
            <a>
                <img id="logoImg" src="/static/img/yt1.png" data-logo_big="/static/img/yt1.png"
                     data-logo_small="/static/img/yt3.png" alt="Nixon"/>
            </a>
        </div>
        <div class="hamburger sidebar-toggle">
            <span class="ti-menu"></span>
        </div>
    </div>
    <div class="pull-right p-r-15">
        <ul>
            <li class="header-icon dib">
                <img class="avatar-img" src="/static/assets/images/avatar/1.jpg" alt=""/> <span
                    class="user-avatar"><span th:text="${session.username}"></span>&nbsp;&nbsp;&nbsp;<i
                    class="ti-angle-down f-s-10"></i></span>
                <div class="drop-down dropdown-profile">
                    <div class="dropdown-content-body">
                        <ul>
                            <li><a href="/exit/"><i class="ti-power-off"></i> <span>注销</span></a></li>
                        </ul>
                    </div>
                </div>
            </li>
        </ul>
    </div>
</div>

<div class="content-wrap">
    <div class="main">
        <div class="container-fluid">
            <div class="row">
                <div class="col-lg-8 p-0">
                    <div class="page-header">
                        <div class="page-title">
                            <h1>幼儿管理</h1>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 p-0">
                    <div class="page-header">
                        <div class="page-title">
                            <ol class="breadcrumb text-right">
                                <a href="javascript:;" class="btn-link" style="font-size: 16px;" id="back">
                                    <span class="glyphicon glyphicon-triangle-left" aria-hidden="true"></span>返回
                                </a>
                            </ol>
                        </div>
                    </div>
                </div>
            </div>
            <div class="main-content">
                <div class="row">
                    <div class="card alert">
                        <div class="card-header">
                            <h4>编辑幼儿缴费</h4>
                            <div class="card-header-right-icon">
                            </div>
                        </div>
                        <div class="card-body">
                            <div class="basic-elements">
                                <form id="ff" action="/update_childpay/" method="post">
                                    <div class="row">
                                        <div class="col-lg-6">
                                            <div class="form-group">
                                                <label>姓名</label>
                                                <span id="jname" class="form-control" style="background:#eee;"></span>
                                                <input type="hidden" name="cid" id="cid">
                                                <input type="hidden" name="cpid" id="cpid">
                                            </div>
                                            <div class="form-group">
                                                <label>缴费方式</label>
                                                <select class="form-control" name="cpway" id="cpway" required>
                                                    <option value="1">按月交</option>
                                                    <option value="2">按季度</option>
                                                    <option value="0">自定义</option>
                                                </select>
                                            </div>
                                            <div class="form-group">
                                                <label>起始日期</label>
                                                <input class="form-control" type="date" name="cpstart" id="cpstart" required>
                                            </div>
                                            <div class="form-group">
                                                <label>结束日期</label>
                                                <input class="form-control" type="date" name="cpend" id="cpend" required>
                                            </div>
                                            <div class="form-group">
                                                <label>费用总计</label>
                                                <input class="form-control" type="text" name="cmoney" id="cmoney" placeholder="请输入费用" required>
                                            </div>
                                            <div class="form-group">
                                                <input type="submit" class="btn btn-success m-b-10 m-l-5" value="确认修改">
                                                <a href="javascript:;" id="back2" class="btn btn-warning m-b-10 m-l-5">返回</a>
                                            </div>
                                        </div>
                                        <div class="col-lg-6">
                                            <div class="form-group">
                                                <img src="/static/img/child.png" width="500" alt="幼儿图片"/>
                                            </div>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            Copyright &copy; 2024
        </div>
    </div>
</div>
<script src="/static/assets/js/lib/jquery.min.js"></script>
<script src="/static/assets/js/lib/jquery.nanoscroller.min.js"></script>
<script src="/static/assets/js/lib/sidebar.js"></script>
<script src="/static/assets/js/lib/bootstrap.min.js"></script>
<script src="/static/assets/js/lib/mmc-common.js"></script>
<script src="/static/assets/js/lib/mmc-chat.js"></script>
<script src="/static/assets/js/lib/chart-js/Chart.bundle.js"></script>
<script src="/static/assets/js/lib/chart-js/chartjs-init.js"></script>
<script src="/static/assets/js/lib/datamap/d3.min.js"></script>
<script src="/static/assets/js/lib/datamap/topojson.js"></script>
<script src="/static/assets/js/lib/datamap/datamaps.world.min.js"></script>
<script src="/static/assets/js/lib/datamap/datamap-init.js"></script>
<script src="/static/assets/lib/lobipanel/js/lobipanel.js"></script>
<script src="/static/assets/js/scripts.js"></script>
<script>
    function getQueryParam(name) {
        const urlParams = new URLSearchParams(window.location.search);
        return urlParams.get(name);
    }

    // 格式化日期，截取年月日
    function formatDateToYMD(datetimeStr) {
        if (!datetimeStr) return '';
        return datetimeStr.substring(0, 10);
    }

    $(document).ready(function () {
        const cpid = getQueryParam('id'); // 缴费记录 id
        if (!cpid) {
            alert('缺少缴费记录id参数，无法加载数据');
            return;
        }

        // 返回按钮
        $('#back, #back2').click(function () {
            window.history.back();
        });

        // 获取缴费记录详情
        $.get('/api/v1/manager/childPay/detail?id=' + cpid, function (res) {
            if (res.code === 200 && res.data) {
                const data = res.data;

                $('#cid').val(data.cid);

                $('#cpway').val(data.cpway);

                $('#cpstart').val(formatDateToYMD(data.cpstart));
                $('#cpend').val(formatDateToYMD(data.cpend));

                $('input[name="cmoney"]').val(data.cmoney);

                // 获取幼儿姓名
                $.get('/api/v1/manager/childPay/checkname?id=' + data.cid, function (d) {
                    if (d.code === 200 && d.data && d.data.cname) {
                        $('#jname').text(d.data.cname);
                    } else {
                        $('#jname').text('未知');
                    }
                });
            } else {
                alert('未找到该缴费记录数据');
            }
        }).fail(function () {
            alert('加载缴费信息失败，请稍后重试');
        });

        // 表单提交 - 你form的id是ff，但html里没看到这个id，确保form加上id="ff"
        $('#ff').submit(function (e) {
            e.preventDefault();

            const jsonData = {
                cpid: cpid,
                cid: $('#cid').val(),
                cpway: $('#cpway').val(),
                cpstart: $('#cpstart').val(),
                cpend: $('#cpend').val(),
                cmoney: $('input[name="cmoney"]').val()
            };

            $.ajax({
                url: '/api/v1/manager/childPay/update',
                type: 'POST',
                contentType: 'application/json',
                data: JSON.stringify(jsonData),
                dataType: 'json',
                success: function (res) {
                    if (res.code === 200) {
                        alert('修改成功！');
                        window.location.href = '/child_pay?cid=' + encodeURIComponent(jsonData.cid);
                    } else {
                        alert('修改失败：' + res.message);
                    }
                },
                error: function () {
                    alert('请求失败，请稍后重试');
                }
            });
        });

        // 缴费方式变更时控制起止日期的可编辑状态
        $('#cpway').change(function () {
            var val = $(this).val();

            // 只在选择“月付”或“季度付”时自动设置日期并锁定，否则自定义可编辑
            if (val === '1' || val === '2') {
                $('#cpstart').prop('readonly', true);
                $('#cpend').prop('readonly', true);

                var start = new Date();
                var end = new Date();

                if (val === '1') {
                    end.setMonth(end.getMonth() + 1);
                } else if (val === '2') {
                    end.setMonth(end.getMonth() + 3);
                }

                // 格式化日期为 YYYY-MM-DD
                function date_format(d) {
                    let y = d.getFullYear();
                    let m = d.getMonth() + 1;
                    let day = d.getDate();
                    if (m < 10) m = '0' + m;
                    if (day < 10) day = '0' + day;
                    return y + '-' + m + '-' + day;
                }

                $('#cpstart').val(date_format(start));
                $('#cpend').val(date_format(end));
            } else {
                // 自定义，允许编辑日期
                $('#cpstart').prop('readonly', false);
                $('#cpend').prop('readonly', false);
            }
        });
    });
</script>
<style>
    .copyrights {
        text-indent: -9999px;
        height: 0;
        line-height: 0;
        font-size: 0;
        overflow: hidden;
    }
</style>
<div class="copyrights">
    <h3>&copy; 版权所有 | </h3>
</div>
</body>

</html>